<template>
  <div>
    <div class="resource-manage">
      <div class="card-box" v-loading="loading">
        <div class="card-title">不动产证信息</div>
        <el-form ref="ruleForm" :model="formObj" class="form-wrap" size="small" :rules="rules">
          <el-form-item label="授权号" prop="useCard.authorizationNumber">
            <el-input v-model="formObj.useCard.authorizationNumber" :disabled="true"></el-input>
          </el-form-item>
          <el-form-item label="使用单位" prop="useCard.apUiId">
            <el-select v-model="formObj.useCard.apUiId" placeholder="请选择单位类型">
              <el-option v-for="item in unitList" :key="item.apUiId" :label="item.unitName" :value="item.apUiId"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="授权类型" prop="useCard.authorizationType">
            <el-select v-model="formObj.useCard.authorizationType" placeholder="请选择授权类型">
              <el-option v-for="item in authTypeLists" :key="item.value" :label="item.label" :value="item.value"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="授权时间" prop="useCard.authorizationTime">
            <el-date-picker v-model="formObj.useCard.authorizationTime" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="选择日期时间"></el-date-picker>
          </el-form-item>
          <el-form-item label="备注" class="full">
            <el-input v-model="formObj.useCard.remarks" placeholder="请输入备注" maxlength="200"></el-input>
          </el-form-item>
          <el-form-item label="附件" class="col-two">
            <v-upload
              type="file"
              ref="useCardUpdateFileUpload"
              :busId="formObj.useCard.useCardId"
              modelType="use-card"
              @onSuccess="saveEntity"
              v-model="formObj.fileList"
            ></v-upload>
          </el-form-item>
        </el-form>
      </div>
    </div>

    <div class="resource-manage">
      <div class="card-box">
        <div class="card-title">物业信息</div>
        <div style="text-align: right;height: 50px;" class="full"></div>
        <el-table :row-style="{ height: '50px' }" :data="formObj.useCardPropertyList" style="width: 100%" class="full">
          <el-table-column prop="propertyId" label="编号"></el-table-column>
          <el-table-column prop="propertyName" label="物业名称"></el-table-column>
          <el-table-column prop="propertyRightStr" label="物业产权"></el-table-column>
          <el-table-column prop="propertyAddress" label="物业地址"></el-table-column>
          <el-table-column prop="addressArea" label="物业面积"></el-table-column>
          <el-table-column prop="startTime" label="开始时间">
            <template slot-scope="scope">
              <el-date-picker
                v-model="scope.row.startTime"
                disabled
                type="date"
                value-format="yyyy-MM-dd HH:mm:ss"
                format="yyyy-MM-dd HH:mm:ss"
                placeholder="选择日期时间"
              ></el-date-picker>
            </template>
          </el-table-column>
          <el-table-column prop="endTime" label="结束时间">
            <template slot-scope="scope">
              <el-date-picker
                v-model="scope.row.endTime"
                disabled
                type="date"
                value-format="yyyy-MM-dd HH:mm:ss"
                format="yyyy-MM-dd HH:mm:ss"
                placeholder="选择日期时间"
              ></el-date-picker>
            </template>
          </el-table-column>
          <el-table-column prop="authorizationUse" label="授权用途">
            <template slot-scope="scope">
              <el-select v-model="scope.row.authorizationUse" disabled>
                <el-option v-for="item in authorizationUseList" :key="item.value" :label="item.label" :value="item.value"></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column prop="practicalUse" label="实际用途">
            <template slot-scope="scope">
              <el-select v-model="scope.row.practicalUse" disabled>
                <el-option v-for="item in practicalUseList" :key="item.value" :label="item.label" :value="item.value"></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column prop="useStatus" :formatter="dictVal_useStatus" label="使用状态"></el-table-column>
          <el-table-column prop="remarks" label="备注"></el-table-column>
        </el-table>
      </div>
    </div>

    <div slot="foot" style="text-align: center">
      <el-button type="primary" size="small" @click="$router.push('/permission-manage/use-card-list')" style="width: 80px" plain>返回</el-button>
      <el-button type="primary" size="small" v-throttle="[sendData]" style="width: 80px">保存</el-button>
    </div>
    <property-list ref="propertyList"></property-list>
  </div>
</template>
<script src="./use-card-edit.js"></script>

<style scoped lang="scss">
@import "../style/common";

@include formWrap(4);
</style>
